import { getApiList, getDictionaryTypeList } from '../../../../service'

export default {
  inject: ['operaTemplateRoot'],
  labelWidth: '94px',
  gap: '12px',
  groupTheme: 'collapse',
  groups: [
    {
      title: '组件配置',
      columnsCount: 2,
      items: [
        {
          type: 'input',
          label: '标识',
          prop: 'componentId',
          readonly: true
        },
        {
          type: 'input',
          label: '名称',
          prop: 'name',
          rules: [{ required: true, message: '请输入控件名称', trigger: 'blur' }]
        },
        {
          type: 'input',
          label: '标签',
          prop: 'label',
          rules: [{ required: true, message: '请输入标签', trigger: 'blur' }]
        },
        {
          type: 'select',
          label: '类型',
          prop: 'type',
          config: {
            optionsValueKey: 'value',
            optionsLabelKey: 'label',
            returnObject: false,
            options: [{ value: 'custom', label: '自定义' },  { value: 'observerTrigger', label: '触发数据接口' }, { value: 'dialog', label: '弹窗' }, { value: 'printing', label: '页面打印' }]
          },
          rules: [{ required: true, message: '请选择类型', trigger: 'change' }]
        },
        {
          type: 'select',
          label: '选择页面',
          prop: 'routerPage',
          config: {
            optionsValueKey: 'id',
            optionsLabelKey: 'name',
            returnObject: false,
            options() {
              return getPageList()
            }
          },
          rules: [{ required: true, message: '请选择页面', trigger: 'change' }],
          exist(value) {
            if (value.type === 'routerLink') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'input',
          label: '',
          labelWidth: '0',
          config: {
            label: '路由参数表达式',
            placeholder: '请输入JSON类型的表达式'
          },
          prop: 'routerQuery',
          exist(value) {
            if (value.type === 'routerLink') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'input',
          label: '',
          labelWidth: '0',
          config: {
            label: '跳转页面标题'
          },
          prop: 'routerLinkTitle',
          exist(value) {
            if (value.type === 'routerLink' && this.$attrs.device === 'APP') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'select',
          label: '选择弹窗',
          prop: 'selectDialog',
          rules: [{ required: true, message: '请选择弹窗', trigger: 'change' }],
          config: {
            optionsValueKey: 'name',
            optionsLabelKey: 'label',
            returnObject: false,
            options() {
              return new Promise((resolve, reject) => {
                setTimeout(() => {
                  resolve(this.childPage)
                })
              })
            },
            filterOptions(one, index) {
              return index !== 0
            }
          },
          exist(value) {
            if (value.type === 'dialog') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'input',
          label: '弹窗宽度',
          prop: 'dialogWidth',
          exist(value) {
            return value.type === 'dialog'
          }
        },
        {
          type: 'input',
          label: '弹窗高度',
          prop: 'dialogHeight',
          exist(value) {
            return value.type === 'dialog'
          }
        },
        // {
        //   type: 'input',
        //   label: '弹窗初始化数据表达式',
        //   prop: 'dialogInitialData',
        //   exist(value) {
        //     if (value.type === 'dialog') {
        //       return true
        //     } else {
        //       return false
        //     }
        //   }
        // },
        {
          type: 'monacoEditor',
          label: '',
          labelWidth: '0',
          config: {
            label: '弹窗初始化数据函数',
            required: true,
            height: '300px',
            lineNumbers: 'on',
            position: 'right'
          },
          prop: 'dialogInitialData',
          exist(value) {
            if (value.type === 'dialog') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'input',
          label: '标题',
          prop: 'dialogTitle',
          rules: [{ required: true, message: '请输入标题', trigger: 'blur' }],
          exist(value) {
            if (value.type === 'dialog') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'select',
          label: '确认',
          prop: 'dialogBehavior',
          config: {
            optionsValueKey: 'value',
            optionsLabelKey: 'label',
            returnObject: false,
            options: [{ label: '发请求', value: 'request' }, { label: '自定义', value: 'custom' }]
          },
          rules: [{ required: true, message: '请选择行为', trigger: 'change' }],
          exist(value) {
            if (value.type === 'dialog') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'select',
          label: '',
          labelWidth: '0',
          prop: 'dialogdataInterfaceId',
          config: {
            label: '请求数据接口',
            required: true,
            optionsValueKey: 'id',
            optionsLabelKey: 'name',
            returnObject: false,
            options() {
              return getApiList()
            }
          },
          rules: [{ required: true, message: '请选择请求数据接口', trigger: 'change' }],
          exist(value) {
            if (value.type === 'dialog' && value.dialogBehavior === 'request') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'monacoEditor',
          label: '',
          labelWidth: '0',
          config: {
            label: '自定义回调函数',
            required: true,
            height: '300px',
            lineNumbers: 'on',
            position: 'right'
          },
          rules: [{ required: true, message: '请输入自定义回调函数', trigger: 'blur' }],
          prop: 'dialogCustomCb',
          exist(value) {
            if (value.type === 'dialog' && value.dialogBehavior === 'custom') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'monacoEditor',
          label: '',
          labelWidth: '0',
          config: {
            label: '成功关闭回调',
            height: '300px',
            lineNumbers: 'on',
            position: 'right'
          },
          prop: 'dialogAfterSuccessHook',
          exist(value) {
            if (value.type === 'dialog') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'monacoEditor',
          label: '',
          labelWidth: '0',
          config: {
            label: '触发函数',
            required: true,
            height: '300px',
            lineNumbers: 'on',
            position: 'right'
          },
          rules: [{ required: true, message: '请输入触发函数', trigger: 'blur' }],
          prop: 'handler',
          exist(value) {
            if (value.type === 'custom') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'input',
          label: '',
          labelWidth: '0',
          config: {
            required: true,
            label: '链接表达式'
          },
          prop: 'linkExpression',
          rules: [{ required: true, message: '请输入链接表达式', trigger: 'blur' }],
          exist(value) {
            if (value.type === 'link') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'select',
          label: '数据接口',
          prop: 'dataInterfaceId',
          config: {
            optionsValueKey: 'name',
            optionsLabelKey: 'name',
            returnObject: false,
            options() {
              return getApiList()
            }
          },
          rules: [{ required: true, message: '请选择数据接口类型', trigger: 'change' }],
          exist(value) {
            if (value.type === 'observerTrigger') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'input',
          label: '',
          labelWidth: '0',
          config: {
            label: '接口参数配置',
          },
          prop: 'interfaceParams',
          exist(value) {
            if (value.type === 'observerTrigger') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'checkbox',
          label: '二次确认',
          config: {
            position: 'right'
          },
          prop: 'needConfirm',
          exist(value) {
            if (value.type !== 'printing') {
              return true
            }else{
              return false
            }
          }
        },
        {
          type: 'input',
          label: '',
          labelWidth: '0',
          config: {
            label: '确认标题表达式',
            required: true
          },
          prop: 'confirmTitle',
          rules: [{ required: true, message: '请输入确认标题', trigger: 'blur' }],
          exist(value) {
            if (value.needConfirm) {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'input',
          label: '',
          labelWidth: '0',
          config: {
            label: '确认内容表达式',
            required: true
          },
          prop: 'confirmContent',
          rules: [{ required: true, message: '请输入确认内容', trigger: 'blur' }],
          exist(value) {
            if (value.needConfirm) {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'color',
          label: '背景颜色',
          config: {
            position: 'right'
          },
          prop: 'backgroundColor',
          rules: [{ required: true, message: '请输入背景颜色', trigger: 'blur' }]
        },
        {
          type: 'color',
          label: '字体颜色',
          config: {
            position: 'right'
          },
          prop: 'color',
          rules: [{ required: true, message: '请输入字体颜色', trigger: 'blur' }]
        },
        {
          type: 'monacoEditor',
          label: '',
          labelWidth: '0',
          config: {
            label: '前置钩子函数',
            height: '300px',
            lineNumbers: 'on',
            position: 'right'
          },
          prop: 'beforeHook'
        },
        {
          type: 'monacoEditor',
          label: '',
          labelWidth: '0',
          config: {
            label: '后置钩子函数',
            height: '300px',
            lineNumbers: 'on',
            position: 'right'
          },
          prop: 'afterHook'
        },
        {
          type: 'commonConfigEditor',
          config: {
            marginLeft: -80,
            height: '300px',
            lineNumbers: 'on',
            title: '打印时显示',
            position: 'right'
          },
          label: '打印时显示',
          prop: 'printVisible',
          exist(value) {
            if (value.type === 'printing') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'commonConfigEditor',
          config: {
            marginLeft: -80,
            height: '300px',
            lineNumbers: 'on',
            title: '',
            position: 'right'
          },
          label: 'loading',
          prop: 'hasLoading',
          exist(value) {
            if (value.type === 'observerTrigger' || value.type === 'custom') {
              return true
            } else {
              return false
            }
          }
        },
        {
          type: 'commonConfigEditor',
          config: {
            marginLeft: -80,
            height: '300px',
            lineNumbers: 'on',
            title: '是否只读',
            position: 'right'
          },
          label: '是否只读',
          prop: 'isReadonlyExp'
        },
        {
          type: 'commonConfigEditor',
          config: {
            marginLeft: -80,
            lineNumbers: 'on',
            title: '是否存在',
            position: 'right'
          },
          label: '是否存在',
          prop: 'isExistExp'
        }
      ]

    }
  ]
}
